﻿@model Epi.Web.MVC.Models.UserLoginModel

@{
    ViewBag.Title = "Epi Info™ Cloud Data Capture - Log In";
    Layout = "~/Views/Shared/_Layout.cshtml";
}


<style>
    .pageheader {
        font: 24px Segoe UI;
        color: #286655;
    }

    .h2header {
        font: 18px Segoe UI;
        color: #286655;
        font-weight: 400;
        margin: 15px 0 0 0 !important;
    }

    .accountdiv {
        float: right;
        width: 400px;
        background: #EBEFF5;
        border: 1px solid #bfbfbf;
        border-radius: 15px;
        padding: 10px 10px 10px 20px;
    }

    .introdiv {
        float: left;
        width: 355px;
        padding: 0 10px 0 0;
    }

    .accountlabel {
        font: 14px Segoe UI;
        font-weight: 600;
    }

    .termsofuse {
        width: 790px;
        padding: 5px;
        height: 300px;
        border: 2px solid #bfbfbf;
        overflow: auto;
    }

    .submits {
        border: 1px #4e9689 solid;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        -khtml-border-radius: 10px;
        border-radius: 10px;
        padding: 3px 5px 3px 5px;
        color: #3f3f3f;
        font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
        font-size: 10pt;
        font-weight: bold;
        padding-left: 10px;
        height: 35px;
        width: 100px;
        cursor: pointer;
        border: 1px solid rgba(0,0,0,0.5);
        box-shadow: 0 2px 6px rgba(0,0,0,0.5), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3);
        -o-box-shadow: 0 2px 6px rgba(0,0,0,0.5), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3);
        -webkit-box-shadow: 0 2px 6px rgba(0,0,0,0.5), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3);
        -moz-box-shadow: 0 2px 6px rgba(0,0,0,0.5), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3);
    }

        .submits:hover {
            background: #ffc;
        }

    .create {
        background: #5880b3;
        background: rgba(88,128,179,0.6);
        max-width: 160px;
        width: 100%;
    }

    [disabled] {
        color: #737882;
        background-color: #dfdfce;
        box-shadow: 0 2px 6px rgba(0,0,0,0.1), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3);
        -o-box-shadow: 0 2px 6px rgba(0,0,0,0.1), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3);
        -webkit-box-shadow: 0 2px 6px rgba(0,0,0,0.1), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3);
        -moz-box-shadow: 0 2px 6px rgba(0,0,0,0.1), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3);
    }

        [disabled]:hover {
            background-color: #dfdfce;
        }

    .Account {
        width: 350px;
        height: 24px;
        font: 14px Segoe UI;
    }

    .field-validation-error {
        color: #ff0000;
         font-size:medium;
    }

    .field-validation-valid {
        display: none;
    }

    .input-validation-error {
        border: 1px solid #ff0000;
        background-color: #ffeeee;
    }

    .validation-summary-errors {
      font-weight: bold;
       height:35px;
        color: #ff0000;
    }

    .validation-summary-valid {
        display: none;
    }

    
</style>
<div id="pageHeader">
    <div id="pageTitle">
        <h2 style="margin:-3px 0px 0px 5px">Log In</h2>
    </div>
    
    <div id="userwelcome"></div>
    <div style="clear: both;"></div>
</div>


<div id="content" style="margin:1em;">
    
    
    <div class="Logsin">
        @using (Html.BeginForm())
        {
            if (Model.ViewValidationSummary && (!string.IsNullOrEmpty(Model.UserName) && !string.IsNullOrEmpty(Model.Password)))
            {
                @Html.ValidationSummary(true, "Please correct the errors and try again.")
             }
              
                <div id="welcome" >
                    <h3>Welcome to Epi Info™ Cloud Data Capture!</h3>
                    <p>The Epi Info™ Cloud Data Capture System is a data collection tool for public health professionals.  </p>
                    <ul style="margin:-5px 5px 5px 20px; padding:0; line-height:1.5em;">
                    <li style="margin:0px 0px 10px 0px;">Collect  data for variety of public health events.</li>
                    <li>Manage the data on the web using your PC or mobile devices.</li>    
                    </ul>
                </div>
    <div id="loginform" style="margin-bottom:2px; font-size:12pt;  display: block;">
        <h3>Log In</h3>
        <label for="Email" style="display: block; font-weight: bold;margin-top:10px;">Email:</label>
        @Html.TextBoxFor(m => m.UserName)<br />
        @Html.ValidationMessageFor(m => m.UserName, null, new { @class = "required" })
        <label for="Passcode" style="display: block; font-weight: bold;margin-top:10px;">Password:</label>
        @Html.PasswordFor(m => m.Password)<br />
        @Html.ValidationMessageFor(m => m.Password, null, new { @class = "required" })
        <p><button type="submit" value="Log in" class="default">Log In</button></p>
        @if (@System.Configuration.ConfigurationManager.AppSettings["IsDemoMode"] == null)
        {
            <div> @Html.ActionLink("Forgot Password?", "ForgotPassword", "Login")</div>
        }
                @if (@System.Configuration.ConfigurationManager.AppSettings["IsDemoMode"] != null)
                {
                    if (@System.Configuration.ConfigurationManager.AppSettings["IsDemoMode"].ToUpper() == "FALSE")
                    {
                    <div>@Html.ActionLink("Forgot Password?", "ForgotPassword", "Login")
                    </div>
                    }
                }
                        
                </div>
          } 
       
    </div>
    
    <div style="clear:both;"></div>
@if (@System.Configuration.ConfigurationManager.AppSettings["SHOW_TERMS_OF_USE"].ToUpper() == "TRUE")
{ 
    <div id="TOU">
        <h2 class="h2header">Terms of service and conditions of use</h2>
        <div class="termsofuse">
            @Html.Raw(ViewData["TermOfUse"].ToString())
        </div>
    </div>
   }
</div>
